<template>
	<div class="good-info">
		<div class="good-image">
			<img v-lazy="goodImage">
		</div>
		<div class="good-name">{{ goodName }}</div>
		<div class="good-price">￥{{ goodPrice | moneyFilter }}</div>
	</div>
</template>

<script>
import { toMoney } from '@/filter'

export default {
	name: 'GoodInfo',
	props: ['goodImage', 'goodName', 'goodPrice'],
	filters: {
		moneyFilter(money) {
			return toMoney(money)
		}
	}
}
</script>

<style lang="scss" scoped>
.good-image {
	img {
		width: 90%;
	}
}

.good-name {
	padding: 0 8px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
</style>
